<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/reset.css" />
		<link rel="stylesheet" href="css/zhu.css" />
		<link rel="stylesheet" href="css/swiper-3.4.2.min.css" />
	    
		
		
		</head>

	<body>
		<header class="head">
			<span><img src="imgs/images/lo_03.png"/></span>
			<span>今天穿什么</span>
			<span><img src="imgs/images/lo_05.png"/></span>
		</header>
		<section class="one_1">
			<dl>
				<dt><img src="imgs/ding.png"/></dt>
				<dd>北京</dd>
			</dl>
		</section>
		<section class="one_2">

			<div class="swiper-container">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<div class="aihao_one">
				<ul class="two">

				</ul>
			</div>
					</div>
					<div class="swiper-slide">
						<div class="aihao_one">
				<ul class="two">

				</ul>
			</div>
					</div>
					<div class="swiper-slide">
						<div class="aihao_one">
				<ul class="two">

				</ul>
			</div>
					</div>
					<div class="swiper-slide">
						<div class="aihao_one">
				<ul class="two">

				</ul>
			</div>
					</div>
					<div class="swiper-slide">
						<div class="aihao_one">
				<ul class="two">

				</ul>
			</div>
					</div>

				</div>

				<!--如果需要分页器-->
				<div class="swiper-pagination"></div>

				<!-- 如果需要导航按钮 -->
				<!--<div class="swiper-button-prev"></div>-->
				<!--<div class="swiper-button-next"></div>-->

				<!-- 如果需要滚动条 -->
				<!--<div class="swiper-scrollbar"></div>-->

			</div>

			
			<script type="text/html" id="list">
				{{each list as v i}}
				<li>
					<img src="{{v.imgs}}" />
					<p>{{v.font}}</p>

				</li>
				{{/each}}
			</script>
<script type="text/javascript" src="../Resources/jquery-3.2.0.js"></script>
		<script src="../Resources/artTemplate.js"></script>
		<script src="../Resources/flexible.debug.js"></script>
		<script src="../Resources/flexible_css.debug.js"></script>
		<script src="../Resources/swiper/swiper.min.js"></script>
			<script>
				$(function() {
					var _url = "json/zhu.json";
					$.get(_url, function(res) {
						console.log(res)
						var str = '';
						var str = template("list", {
							list: res
						});
						console.log(str);
						$('.two').html(str);
					});
				})

				var mySwiper = new Swiper('.swiper-container', {
					//				direction: 'vertical',
					loop: true,

					// 如果需要分页器
					pagination: '.swiper-pagination',

					// 如果需要前进后退按钮
					//				nextButton: '.swiper-button-next',
					//				prevButton: '.swiper-button-prev',

					// 如果需要滚动条
					//				scrollbar: '.swiper-scrollbar',
				})
			</script>
		</section>
	</body>

</html>